<template>
	<view class="grid gap-2 p-2" style="grid-template-columns: repeat(3, 1fr);">
		<view v-for="item in list">
			<navigator
				:url="'/pages/wallpaper/items?id='+ encodeURIComponent(JSON.stringify(item._id))+'&name='+encodeURIComponent(JSON.stringify(item.name))"
				hover-class="navigator-hover">
				<image class="w-full h-[200px]" :src="item.picurl" />
				<div class="text-center">{{item.name}}</div>
			</navigator>
		</view>
	</view>
</template>

<script setup lang="ts">
	import axios from 'axios';
	let list = ref([])
	onMounted(() => {
		initData()
	})
	const initData = async () => {
		const res = await axios.get('https://tea.qingnian8.com/api/bizhi/classify')
		list.value = res.data.data
	}
</script>